<template>
  <div>
    <el-menu
        style="width: 250px ;min-height: 20vh;"
        default-active="user"
        router
        class="el-menu-vertical-demo">

      <el-menu-item index="Home">首页</el-menu-item>
      <el-menu-item index="Dormitory" v-if="isshow">宿舍情况管理</el-menu-item>
      <el-menu-item index="MonitorSettings">监控管理</el-menu-item>
      <el-menu-item index="MusicNews">音乐新闻</el-menu-item>
      <el-menu-item index="Message">智能留言</el-menu-item>
      <el-menu-item index="Settings">设置</el-menu-item>
      
    </el-menu>
  </div>
</template>

<script>
export default {
  name: "Aside",
  data() {
    return {
      loginfome: {
        role: '',
      },
      isshow: true,
    }
  },
  created() {
    let role = sessionStorage.getItem("user");
    console.log("++++++++++++++++++++++++++++++++++++")
    console.log(JSON.parse(role).role[0].roleName)
    if (JSON.parse(role).role[0].roleName == "系统管理员") {
      this.isshow = true;
    }else {
      this.isshow=false;
    }
  }
}
</script>

<style scoped>
  .el-menu {
    background-color: rgba(0,0,0,0);
    color: whitesmoke;
    border-right: none;
  } 
  .el-menu-item {
    color: whitesmoke;
    padding-left: 40px !important;
  }
  .el-menu-item:hover {
    background-color: rgba(245, 245, 245, 0.3);
  }
  .el-menu-item:focus {
    background-color: rgba(0,0,0,0);
  }
</style>